<template>
  <div class="contarner-page" @click.stop="showLanguageHandel">
    <page-header ref="languageRef"></page-header>
    <main>
      <div class="downloader flex_ccenter" v-if="!success">
        <div class="container">
          <div class="hero-widgets flex_between c-fff">
            <div class="tool-item shou flex_center" @click="changeTab(0)">
              <img src="/static/images/video.svg" alt="savinginsta video" />
              <span class="f-16">Video</span>
            </div>
            <div class="tool-item shou flex_center" @click="changeTab(1)">
              <img src="/static/images/Photo.svg" alt="savinginsta photo" />
              <span class="f-16">Photo</span>
            </div>
            <div class="tool-item shou flex_center" @click="changeTab(2)">
              <img src="/static/images/Reels.svg" alt="savinginsta reels" />
              <span class="f-16">Reels</span>
            </div>
            <div class="tool-item shou flex_center" @click="changeTab(3)">
              <img src="/static/images/Story.svg" alt="savinginsta story" />
              <span class="f-16">Story</span>
            </div>
            <div class="tool-item shou flex_center" @click="changeTab(4)">
              <img src="/static/images/Igtv.svg" alt="savinginsta IGTV" />
              <span class="f-16">IGTV</span>
            </div>
          </div>
          <div class="banner-heading flex_ccenter">
            <div class="heading-item" v-show="current == 0">
              <h1 class="title fw700 f-42 c-fff">Instagram videó letöltése</h1>
              <h2 class="sub c-fff f-18 fw400">
                Töltse le az Instagram-videókat, fotókat, tekercseket,
                történeteket és az IGTV-t Online tartalom
              </h2>
            </div>
            <div class="heading-item" v-show="current == 1">
              <nuxt-link to="/hu/instagram-photo-download">
                <div @click="goToTop('Photo')" class="tItem">
                  <h3 class="title fw700 f-42 c-fff shou">
                    Instagram Photo Downloader
                  </h3>
                </div>
              </nuxt-link>
              <p class="sub c-fff f-18 fw400">
                Adja meg alább az Instagram PHOTO URL-jét
              </p>
            </div>
            <div class="heading-item" v-show="current == 2">
              <nuxt-link to="/hu/instagram-reels-video-download">
                <div @click="goToTop('reels')" class="tItem">
                  <h3 class="title fw700 f-42 c-fff shou">
                    Download Instagram Reels
                  </h3>
                </div>
              </nuxt-link>
              <p class="sub c-fff f-18 fw400">
                Adja meg alább az Instagram tekercsek URL-címét
              </p>
            </div>
            <div class="heading-item" v-show="current == 3">
              <nuxt-link to="/hu/instagram-story-download">
                <div @click="goToTop('story')" class="tItem">
                  <h3 class="title fw700 f-42 c-fff shou">
                    Instagram Story letöltése
                  </h3>
                </div>
              </nuxt-link>
              <p class="sub c-fff f-18 fw400">
                Adja meg alább az Instagram Stories URL-jét
              </p>
            </div>
            <div class="heading-item" v-show="current == 4">
              <nuxt-link to="/hu/igtv-downloader">
                <div @click="goToTop('igtv')" class="tItem">
                  <h3 class="title fw700 f-42 c-fff shou">
                    Videó letöltése IGTV
                  </h3>
                </div>
              </nuxt-link>
              <p class="sub c-fff f-18 fw400">
                Adja meg alább az Instagram IGTV URL-jét
              </p>
            </div>
          </div>
          <div class="form flex_center">
            <div class="input-box flex_between">
              <!-- <input
                type="text"
                class="input f-18"
                v-model="input"
                @input="handleInput"
                @paste="handleInput"
                placeholder="Paste URL Instagram"
                list="fruits"
                name="fruit"
              />
              <datalist id="fruits">
                <option value="Apple"></option>
                <option value="Banana"></option>
                <option value="Cherry"></option>
              </datalist> -->
              <input
                type="text"
                class="input f-18"
                v-model="input"
                :disabled="isHttpLoading"
                @input="handleInput"
                @paste="handleInput"
                @keydown="sendDownload($event)"
                placeholder="Paste URL Instagram"
              />
              <div
                class="Paste shou flex_center"
                @click="handleClickPasted"
                v-if="input == ''"
              >
                <div class="btnbg"></div>
                <div class="f-16 c-000 fw700">Paste</div>
              </div>
              <div
                class="clear shou flex_center"
                v-if="input != '' && !isHttpLoading"
                @click.stop="input = ''"
              >
                <div class="btnbg"></div>
                <div class="f-16 c-000 fw700">Clear</div>
              </div>
            </div>
            <div
              v-if="!isHttpLoading"
              @click.stop="downloadHandel"
              class="submit shou fw700 c-fff flex_center"
            >
              Download
            </div>
            <div v-else class="submit shou fw700 c-fff flex_center">
              Please wait
            </div>
          </div>
          <div class="app-submit flex_ccenter">
            <div
              class="submit flex_center"
              v-if="!isHttpLoading"
              @click.stop="downloadHandel"
            >
              <div class="fw700 c-fff f-21">Download</div>
            </div>
            <div class="submit flex_center" v-else>
              <div class="fw700 c-fff f-21">Please wait</div>
            </div>
          </div>
          <div class="loading" v-if="isHttpLoading">
            <div class="loading-dots flex_center">
              <div class="dot"></div>
              <div class="dot"></div>
              <div class="dot"></div>
              <div class="dot"></div>
            </div>
            <div class="tips f-18 flex_center">
              <div>Adatok lekérése, kérjük, várjon néhány másodpercet!</div>
            </div>
          </div>
          <div class="error flex_ccenter" v-if="httpError1">
            <div class="hono flex_">
              <div class="error-img"></div>
              <div class="error-img"></div>
              <div class="error-img"></div>
            </div>
            <div class="errMsg f-18">
              A webhely nem tudja feldolgozni a linkjét, mert az privát
            </div>
          </div>
          <div class="error flex_ccenter" v-if="httpError2">
            <div class="hono flex_">
              <div class="error-img"></div>
              <div class="error-img"></div>
              <div class="error-img"></div>
            </div>
            <div class="errMsg f-18">
              A megadott adatok nem hivatkozások. Kérjük, adjon meg egy érvényes
              linket, for példa:
              <div>https://www.instagram.com/reel/Cml9qu-ISqx</div>
            </div>
          </div>
        </div>
      </div>
      <!-- 广告位start -->
      <!-- 广告位end -->
      <div class="container" v-if="!success">
        <div class="body-content">
          <div class="title-box">
            <h3 class="title f-36 c-000 italic">
              A Savinginsta.Com összes funkciója
            </h3>
            <p class="sub f-16 c-ccc">
              A Savinginsta kompatibilis az Instagram-videók összes fajtájával
              és képlinkek.
            </p>
          </div>
          <div class="list-tools-pc">
            <div class="tool-box flex_between">
              <div class="tool-info">
                <nuxt-link to="/hu">
                  <div @click="goToTop('video')" class="tItem">
                    <h4>Instagram videó letöltő</h4>
                  </div>
                </nuxt-link>
                <p>
                  A Savinginsta célja, hogy lehetővé tegye a saját letöltését
                  tartalmat az Instagramról. Mindkettő letöltését támogatja
                  egyéni és több videó az Instáról.
                </p>
              </div>
              <div class="tool-thumb">
                <img
                  src="/static/images/instagram-video-downloader.webp"
                  alt="Instagram video downloader"
                />
              </div>
              <div class="tool-thumb-app">
                <img
                  src="/static/images/instagram-video-downloader-app.webp"
                  alt="Instagram video downloader"
                />
              </div>
            </div>
            <div class="tool-box tool-reverse flex_between">
              <div class="tool-info">
                <nuxt-link to="/hu/instagram-photo-download">
                  <div @click="goToTop('Photo')" class="tItem">
                    <h4>Instagram fotó letöltő</h4>
                  </div>
                </nuxt-link>
                <p>
                  A Savinginsta Instagram Photo Downloader segítségével
                  könnyedén megoldható egyetlen vagy több fénykép mentéséhez,
                  beleértve a kollázsokat is, az Instagramról. Ezzel az
                  eszközzel az egyes bejegyzések letöltése képek vagy
                  Instagram-fotók gyűjteménye egyszerű és egyértelmű.
                </p>
              </div>
              <div class="tool-thumb">
                <img
                  loading="lazy"
                  src="/static/images/instagram-photo-downloader.webp"
                  alt="Instagram photo downloader"
                />
              </div>
              <div class="tool-thumb-app">
                <img
                  loading="lazy"
                  src="/static/images/instagram-photo-downloader-app.webp"
                  alt="Instagram photo downloader"
                />
              </div>
            </div>
            <div class="tool-box flex_between">
              <div class="tool-info">
                <nuxt-link to="/hu/instagram-reels-video-download">
                  <div @click="goToTop('reels')" class="tItem">
                    <h4>Töltse le az Instagram tekercseket</h4>
                  </div>
                </nuxt-link>
                <p>
                  A Savinginsta Instagram Reels Downloaderje lehetővé teszi,
                  hogy könnyedén letöltheti a Reels videókat az
                  Instagram-bejegyzésekből ide eszközét, egyszerű megoldást
                  nyújtva az Instagram számára maga nem támogatja ezt a
                  funkciót.
                </p>
              </div>
              <div class="tool-thumb">
                <img
                  loading="lazy"
                  src="/static/images/download-instagram-reels.webp"
                  alt="Download Instagram Reels"
                />
              </div>
              <div class="tool-thumb-app">
                <img
                  loading="lazy"
                  src="/static/images/download-instagram-reels-app.webp"
                  alt="Download Instagram Reels"
                />
              </div>
            </div>
            <div class="tool-box tool-reverse flex_between">
              <div class="tool-info">
                <nuxt-link to="/hu/igtv-downloader">
                  <div @click="goToTop('igtv')" class="tItem">
                    <h4>IGTV letöltő</h4>
                  </div>
                </nuxt-link>
                <p>
                  Az Instagram történetek egyedi platformot kínálnak a
                  felhasználók számára osszák meg napi tapasztalataikat fotók és
                  videók segítségével a széles közönség. Esetenként érdemes
                  elmenteni egy kedvencet történet, de ez a funkció nem érhető
                  el az alkalmazásban. A Savinginsta úgy kezeli ezt a problémát,
                  hogy megoldást kínál arra lehetővé teszi a felhasználók
                  számára az Instagram-történetek egyszerű letöltését és
                  megtekintését offline, biztosítva, hogy az emlékezetes
                  tartalom soha ne vesszen el.
                </p>
              </div>
              <div class="tool-thumb">
                <img
                  loading="lazy"
                  src="/static/images/igtv-downloader.webp"
                  alt="IGTV downloader"
                />
              </div>
              <div class="tool-thumb-app">
                <img
                  loading="lazy"
                  src="/static/images/igtv-downloader-app.webp"
                  alt="IGTV downloader"
                />
              </div>
            </div>
            <div class="tool-box flex_between">
              <div class="tool-info">
                <nuxt-link to="/hu/instagram-story-download">
                  <div @click="goToTop('story')" class="tItem">
                    <h4>Instagram Story Viewer</h4>
                  </div>
                </nuxt-link>
                <p>
                  Az IGTV kiterjesztett hosszúságú videókat kínál, és ha nem tud
                  azonnal megtekintheti őket, lehetősége van ezek letöltésére
                  IGTV videókat a számítógépére. Ez lehetővé teszi, hogy
                  kényelmesen nézze meg újra és élvezze őket később, még
                  internet nélkül is kapcsolatot, és kiküszöböli az
                  IGTV-tartalommal kapcsolatos aggodalmakat eltávolítva vagy nem
                  elérhető.
                </p>
              </div>
              <div class="tool-thumb">
                <img
                  loading="lazy"
                  src="/static/images/instagram-story-download.webp"
                  alt="Instagram Story Download"
                />
              </div>
              <div class="tool-thumb-app">
                <img
                  loading="lazy"
                  src="/static/images/instagram-story-download-app.webp"
                  alt="Instagram Story Download"
                />
              </div>
            </div>
          </div>
          <div class="app-box">
            <div class="app-box__info">
              <h3 class="app-box__title f-21 fw700 c-000">
                Töltse le az Insta Downloader alkalmazással
              </h3>
              <p class="f-16 c-ccc">
                Alkalmazásunk gyors és egyszerű megoldást kínál a letöltéshez
                Instagram videók, HD minőségű videók nélkül vízjelek.
              </p>
            </div>
            <div class="app-link">
              <a 
                  target="_blank" href="https://play.google.com/store/apps/details?id=ins.freevideodownload.pro">
                <img src="/static/images/google-play.webp" alt="Download app " />
              </a>
              <a href="https://apps.apple.com/us/app/repost-for-video-save-story/id6462401460"  target="_blank">
                <img src="/static/images/IOS.webp" alt="Download app " />
              </a>
            </div>
          </div>
          <div class="quick-info">
            <h3 class="f-32 c-000">
              SAVINGINSTA - LEGJOBB SZERSZÁM INSTAGRAM LETÖLŐ
            </h3>
            <p class="f-16 c-ccc">
              A Savinginsta kiemelkedik a legjobb Instagram letöltőként,
              szakszerűen kidolgozott, hogy gyorsan letöltsön kiváló minőségű
              tartalmat innen Instagram. Amikor a leghatékonyabb letöltési módot
              keresi Az Instagram média, a Savinginsta letöltő vezető szerepet
              tölt be harmadik féltől származó megoldás.
            </p>
            <p class="f-16 c-ccc">
              Az Instagram, amely a világ legnépszerűbb fotómegosztó
              alkalmazásaként ismert, naponta több millió fénykép feltöltésének
              tanúja. Az ilyenekre pillanatok alatt szükségessé válik egy
              Instagram videó letöltő nyilvánvaló, zökkenőmentes megoldást
              nyújtva azonnali igényeire. Ez az eszköz nélkülözhetetlen mindenki
              számára, aki meg akarja őrizni saját magát kedvenc
              Instagram-tartalmak hatékonyan.
            </p>
          </div>
          <div class="features c-fff">
            <h3 class="h3 fw700 f-21">
              A Savinginsta Instagram videóletöltő funkciói:
            </h3>
            <div class="attributes-list flex_between">
              <div class="item flex_">
                <div class="bgimg"></div>
                <div class="f-14 c-fff">
                  Instagram-videó Letöltés Gyors, egyszerű és biztonságos.
                </div>
              </div>
              <div class="item flex_">
                <div class="bgimg"></div>
                <div class="f-14 c-fff">
                  Kijelentkezhet Instagram-fiókjából.
                </div>
              </div>
              <div class="item flex_">
                <div class="bgimg"></div>
                <div class="f-14 c-fff">
                  Egy gombnyomással letöltheti az Instagram-képeket és videókat.
                </div>
              </div>
              <div class="item flex_">
                <div class="bgimg"></div>
                <div class="f-14 c-fff">
                  Töltse le és mentse el a képeket és a videókat az eredeti
                  magasságukban meghatározás és minőség.
                </div>
              </div>
              <div class="item flex_">
                <div class="bgimg"></div>
                <div class="f-14 c-fff">
                  Személyes fiókokból töltsön le és mentsen Instagram-videókat.
                </div>
              </div>
              <div class="item flex_">
                <div class="bgimg"></div>
                <div class="f-14 c-fff">
                  Nagy sebesség: Jelenleg a Savinginsta kínálja a leggyorsabbat
                  letöltési sebességek.
                </div>
              </div>
            </div>
          </div>
          <div class="how">
            <div class="how-title">
              <h3 class="f-36 c-000 italic">
                A Savinginsta Instagram Downloader használata az IG-ből való
                mentéshez
              </h3>
              <div class="note c-ccc f-16">
                Megjegyzés: Győződjön meg arról, hogy a kívánt Instagram-videót
                vagy fotót a letöltés nyilvános fiókból történik.
              </div>
            </div>
            <div class="steps">
              <div class="step">
                <div class="one">
                  <span class="fw700 c-blue f-16">01. lépés:</span>
                  <span class="f-16 c-000"
                    >Másolja ki az Instagram-fotók és videók URL-jét</span
                  >
                </div>
                <div class="app-step">
                  <div class="fw700 c-000 f-16">
                    Az Instagram alkalmazásban:
                  </div>
                  <div class="c-000 f-16">
                    iOS esetén: Koppintson az Instagram-fotó URL-címének
                    megtekintéséhez.
                  </div>
                  <div class="c-000 f-16">
                    Android esetén: Kattintson a bejegyzés feletti elemre, és
                    válassza a „Másolás a Instagram URL”, majd kattintson a
                    „Másolás megosztási URL-címre” gombra. A link az lesz a
                    vágólapra másolva.
                  </div>
                  <div class="fw700 c-000 f-16">- PC-n/Mac-en:</div>
                  <div class="c-000 f-16">
                    Kattintson a jobb gombbal az Instagram videó vagy fénykép
                    dátumára, és válassza a "Link címének másolása" lehetőséget
                    az Instagram-tartalom letöltéséhez az asztalon.
                  </div>
                </div>
              </div>
              <div class="step">
                <div class="one">
                  <span class="fw700 c-blue f-16">02. lépés:</span>
                  <span class="f-16 c-000">
                    Illessze be az URL-t a Savinginsta.App alkalmazásba</span
                  >
                </div>
                <div class="app-step">
                  <div class="c-000 f-16">
                    Keresse meg a Savinginsta.App alkalmazást – a dedikált
                    Instagramot letöltő.
                  </div>
                  <div class="c-000 f-16">
                    Másolja ki és illessze be a másolt URL-t a megadott
                    szövegmezőbe.
                  </div>
                </div>
              </div>
              <div class="step">
                <div class="one">
                  <span class="fw700 c-blue f-16">03. lépés:</span>
                  <span class="f-16 c-000">Indítsa el a letöltést</span>
                </div>
                <div class="app-step">
                  <div class="c-000 f-16">
                    Kattintson a "Letöltés" gombra az Instagram videó
                    elindításához vagy fotó letöltési folyamat.
                  </div>
                  <div class="fw700 c-000 f-16">
                    Fontos használati információk
                  </div>
                  <div class="c-000 f-16">
                    A Savinginsta elsősorban videók letöltésére és képeket a
                    saját Instagram-fiókodból.
                  </div>
                  <div class="c-000 f-16">
                    Előnyben részesítjük a felhasználói adatvédelmet, és
                    fenntartjuk az elutasítás jogát szolgáltatást, ha
                    eszközeinket mások jogsértésére használjuk magánélet
                    védelmét vagy jogosulatlan anyagokhoz való hozzáférést.
                  </div>
                </div>
              </div>
            </div>
            <div class="user-note f-16">
              <div class="app-tip"></div>
              Irányelveink átfogó megértéséhez

              <a class="fw700 c-blue" href="/terms-of-service">
                Kérjük, olvassa el a teljes szolgáltatási feltételeinket itt.</a
              >
            </div>
          </div>
          <div class="faq-section">
            <h3 class="faq-title f-36 c-000 italic">FAQ</h3>
            <div class="accordion">
              <div
                id="faq"
                itemscope="itemscope"
                itemtype="https://schema.org/FAQPage"
              >
                <div
                  itemprop="mainEntity"
                  itemscope="itemscope"
                  itemtype="https://schema.org/Question"
                  class="accordion-item"
                  :key="k"
                  v-for="(item, k) in faqList"
                >
                  <h4 itemprop="name" class="accordion-title fw700 f-16">
                    {{ item.title }}
                  </h4>
                  <div
                    itemprop="acceptedAnswer"
                    itemscope=""
                    itemtype="https://schema.org/Answer"
                  >
                    <div
                      itemprop="text"
                      class="accordion-text f-16 c-ccc fw400"
                    >
                      {{ item.content }}
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!-- 解析结果 start -->
      <div class="container" v-if="success">
        <success-content
          @refresh="refresh"
          :list="successList"
        ></success-content>
      </div>
      <!-- 解析结果 end -->
    </main>
    <footer>
      <div class="container">
        <div class="footer-content">
          <div class="footer-link">
            <div class="row flex_between">
              <div class="col-12">
                <div class="link-label fw700 c-000 f-21">Eszközök</div>
                <ul class="list-unstyled c-ccc f-16">
                  <li @click="goToTools('story')">
                    <nuxt-link to="/hu/instagram-story-download"
                      >Instagram Story Downloader</nuxt-link
                    >
                  </li>
                  <li @click="goToTools('reels')">
                    <nuxt-link to="/hu/instagram-reels-video-download"
                      >Instagram tekercsek letöltő</nuxt-link
                    >
                  </li>
                  <li>
                    <a href="https://savingtik.com/" target="_blank"
                      >Tiktok letöltő</a
                    >
                  </li>
                </ul>
              </div>
              <div class="col-6">
                <div class="link-label fw700 c-000 f-21">Támogatás</div>
                <ul class="list-unstyled c-ccc f-16">
                  <li>
                    <nuxt-link to="/contact"> Kapcsolatba lépni </nuxt-link>
                  </li>
                  <li>
                    <nuxt-link to="/blog"> Blog </nuxt-link>
                  </li>
                </ul>
              </div>
              <div class="col-6">
                <div class="link-label fw700 c-000 f-21">Jogi</div>
                <ul class="list-unstyled c-ccc f-16">
                  <li>
                    <nuxt-link to="/terms-of-service">
                      Szolgáltatás feltételei
                    </nuxt-link>
                  </li>
                  <li>
                    <nuxt-link to="/privacy-policy"> Adatvédelmi irányelvek </nuxt-link>
                  </li>
                </ul>
              </div>
            </div>
          </div>
          <div class="copyright flex_ccenter">
            <b class="fw700 f-21 c-000"
              >Nem vagyunk kapcsolatban az Instagrammal vagy a Metával</b
            >
            <div class="c-ccc f-16">
              © {{new Date().getFullYear()}} Insta Downloader All rights reserved.
            </div>
          </div>
        </div>
      </div>
    </footer>
  </div>
</template>

<script>
import { mapState, mapGetters, mapMutations } from "vuex";
import pageHeader from "~/components/page-header.vue";
import SuccessContent from "~/components/success-content.vue";
import CryptoJS from "crypto-js";
import { handleClick, checkString } from "@/plugins/Firebase.js";

export default {
  components: { pageHeader, SuccessContent },
  name: "IndexPage",
  head: {
    htmlAttrs: {
      lang: "hu",
    },
    bodyAttrs: {
      "data-lang": "hu",
    },
    title:
      "Instagram Downloader - Instagram videó letöltése online - Savinginsta",
    meta: [
      { property: "og:locale", content: "hu" },
      //Page Information
      {
        name: "description",
        content:
          "Savinginsta: Könnyen letölthet Instagram-videókat, tekercseket és fotókat felhasználóbarát eszközünkkel. Mentse Instagram-videóit gyorsan és biztonságosan bármilyen eszközre.",
      },
      //Schema.org Microdata
      {
        itemprop: "name",
        content:
          "Instagram Downloader - Instagram videó letöltése online - Savinginsta",
      },

      // Facebook / OpenGraph
      {
        property: "og:title",
        content:
          "Instagram Downloader - Instagram videó letöltése online - Savinginsta",
      },
      { property: "og:type", content: "website" },
      { property: "og:url", content: "https://savinginsta.com/hu" },

      {
        property: "og:description",
        content:
          "Savinginsta: Könnyen letölthet Instagram-videókat, tekercseket és fotókat felhasználóbarát eszközünkkel. Mentse Instagram-videóit gyorsan és biztonságosan bármilyen eszközre.",
      },
      //Twitter
      { name: "twitter:card", content: "summary" },
      { name: "twitter:url", content: "https://savinginsta.com/hu" },
      {
        name: "twitter:title",
        content:
          "Instagram Downloader - Instagram videó letöltése online - Savinginsta",
      },
      {
        name: "twitter:description",
        content:
          "Savinginsta: Könnyen letölthet Instagram-videókat, tekercseket és fotókat felhasználóbarát eszközünkkel. Mentse Instagram-videóit gyorsan és biztonságosan bármilyen eszközre.",
      },
      //multilingual
      {
        name: "google",
        content: "notranslate",
      },
      {
        itemprop: "image",
        content: "https://savinginsta.com/static/images/savinginsta_thumbnail.jpg",
      },
      {
        property: "og:image",
        content: "https://savinginsta.com/static/images/savinginsta_thumbnail.jpg",
      },
      {
        name: "twitter:image",
        content: "https://savinginsta.com/static/images/savinginsta_thumbnail.jpg",
      },
    ],
    link: [
      //multilingual
      {
        rel: "alternate",
        hreflang: "x-default",
        href: "https://savinginsta.com/hu",
      },
      {
        rel: "alternate",
        hreflang: "en",
        href: "https://savinginsta.com/",
      },
      {
        rel: "alternate",
        hreflang: "en-in",
        href: "https://savinginsta.com/in",
      },
      {
        rel: "alternate",
        hreflang: "vi",
        href: "https://savinginsta.com/vn",
      },
      {
        rel: "alternate",
        hreflang: "tr",
        href: "https://savinginsta.com/tr",
      },
      {
        rel: "alternate",
        hreflang: "id",
        href: "https://savinginsta.com/id",
      },
      {
        rel: "alternate",
        hreflang: "fr",
        href: "https://savinginsta.com/fr",
      },
      {
        rel: "alternate",
        hreflang: "pt",
        href: "https://savinginsta.com/pt",
      },
      {
        rel: "alternate",
        hreflang: "ru",
        href: "https://savinginsta.com/ru",
      },
      {
        rel: "alternate",
        hreflang: "es",
        href: "https://savinginsta.com/es",
      },
      {
        rel: "alternate",
        hreflang: "ms",
        href: "https://savinginsta.com/ms",
      },
      {
        rel: "alternate",
        hreflang: "ko",
        href: "https://savinginsta.com/ko",
      },
      {
        rel: "alternate",
        hreflang: "ja",
        href: "https://savinginsta.com/ja",
      },
      {
        rel: "alternate",
        hreflang: "jv",
        href: "https://savinginsta.com/jv",
      },
      {
        rel: "alternate",
        hreflang: "cs",
        href: "https://savinginsta.com/cs",
      },
      {
        rel: "alternate",
        hreflang: "de",
        href: "https://savinginsta.com/de",
      },
      {
        rel: "alternate",
        hreflang: "it",
        href: "https://savinginsta.com/it",
      },
      {
        rel: "alternate",
        hreflang: "pl",
        href: "https://savinginsta.com/pl",
      },
      {
        rel: "alternate",
        hreflang: "hu",
        href: "https://savinginsta.com/hu",
      },
      {
        rel: "alternate",
        hreflang: "nl",
        href: "https://savinginsta.com/nl",
      },
      {
        rel: "alternate",
        hreflang: "ro",
        href: "https://savinginsta.com/ro",
      },
      {
        rel: "alternate",
        hreflang: "el",
        href: "https://savinginsta.com/el",
      },
      {
        rel: "canonical",
        href: "https://savinginsta.com/hu",
      },
    ],
    script: [
      {
        json: {
          "@context": "https://schema.org",
          "@type": "WebSite",
          name: "Instagram Downloader - Instagram videó letöltése online - Savinginsta",
          url: "https://savinginsta.com",
          description:
            "Savinginsta: Könnyen letölthet Instagram-videókat, tekercseket és fotókat felhasználóbarát eszközünkkel. Mentse Instagram-videóit gyorsan és biztonságosan bármilyen eszközre.",
          publisher: {
            "@type": "Organization",
            name: "Savinginsta",
            logo: {
              "@type": "ImageObject",
              url: "https://savinginsta.com/static/images/logo.webp",
            },
          },
        },
        type: "application/ld+json",
      },
    ],
  },
  data() {
    return {
      input: "",
      success: false,
      isHttpLoading: false,
      httpError1: false,
      httpError2: false,
      current: 0,
      successList: [],
      faqList: [
        {
          title: `Mi az Instagram Video Downloader?`,
          content: `Az Instagram Video Downloader egy webalapú eszköz, amelyet Instagram-fotók, videók és IGTV-tartalom mentésére terveztek későbbi használatra. A Savinginsta kiemelkedik a legjobb választás a tartalom könnyű letöltéséhez az Instagramról.`,
        },
        {
          title: `Be kell jelentkezni az Instagram-fiókomba a Savinginsta használatához?`,
          content: `Nem, nem kell bejelentkeznie Instagram-fiókjába. A Savinginsta biztonságos és anonim letöltéseket biztosít az Instagramról anélkül, hogy személyes adatokra lenne szüksége.`,
        },
        {
          title: `Menthetek közvetlenül videókat az Instagramról?`,
          content: `Magán az Instagramon keresztül nem lehet közvetlenül letölteni videókat az Instagram hírfolyamából vagy mások történeteiből. A Savinginsta azonban egy egyszerű megoldást kínál. Csak látogassa meg webhelyüket a https://savinginsta.com címen, és kövesse az egyszerű utasításokat.`,
        },
        {
          title: `Ingyenes az Instagram videó- és fotóletöltési szolgáltatása?`,
          content: `Igen, a Savinginsta ezt a szolgáltatást teljesen ingyenesen biztosítja, a letöltések számának korlátozása nélkül.`,
        },
        {
          title: `Letölthetek tartalmat privát Instagram-fiókokból?`,
          content: `Valójában a Savinginsta lehetővé teszi, hogy videókat, történeteket és fényképeket töltsön le privát Instagram-fiókokból. A részletes utasítások a platformjukon érhetők el.`,
        },
        {
          title: `Lehetséges az Instagram történetek mentése?`,
          content: `Teljesen. A Savinginsta segítségével bármely Instagram-sztorit megtekinthet és letölthet. Egyszerűen kattintson a három pontra (⁝) a történetben, másolja ki a linket, és illessze be a Savinginstába a letöltés megkezdéséhez.`,
        },
        {
          title: `A Savinginsta támogatja a letöltéseket számítógépeken?`,
          content: `Igen, a Savinginsta teljes mértékben kompatibilis a számítógépekkel, lehetővé téve az Instagram-videók, fotók, történetek és egyebek letöltését közvetlenül a számítógépére.`,
        },
        {
          title: `Használhatom a Savinginstát az Instagramból való letöltéshez Android-eszközökön?`,
          content: `Biztosan. Android-felhasználók számára egyszerűen másolja ki az Instagram-bejegyzés linkjét, illessze be a Savinginstába, és mentse. További részletekért tekintse meg útmutatójukat az Androidon az Instagramról való letöltésről.`,
        },
        {
          title: `Hogyan tölthetek le Instagram-videókat és fotókat iPhone/iPad (iOS) készüléken?`,
          content: `A Savinginsta felhasználóbarát, lépésenkénti útmutatót készített különféle típusú videók letöltéséhez iPhone-ra vagy iPadre. Kövesse ezt a hivatkozást az utasításokért: Töltse le az Instagram-videókat iPhone-ra.`,
        },
        {
          title: `Mi a teendő, ha az Instagram-videó lejátszása a letöltés helyett?`,
          content: `A probléma megoldásához kattintson a jobb gombbal a videóra, és válassza ki a "Mentés másként..." lehetőséget a kívánt mentési hely kiválasztásához a bal kattintás helyett.`,
        },
        {
          title: `Hol tárolják a videókat letöltés után?`,
          content: `A letöltött videók általában a „Letöltések” mappában tárolódnak Android mobileszközökön és számítógépeken egyaránt.`,
        },
      ],
    };
  },
  computed: {
    ...mapGetters(["language"]),
  },
  mounted() {
    this.debouncedDownInput = this.debounce(this.downInput, 1000);

    //到达首页
    handleClick("guide_homepage_frist", {});
    handleClick("guide_homepage", {});
  },
  methods: {
    async downloadHandel() {
      if (this.isHttpLoading || this.input === "") return;
      this.isHttpLoading = false;
      this.httpError1 = false;
      this.httpError2 = false;
      this.input = this.input.replace(/^.*\s?https:\/\//, "https://");
      const insUrlPattern = new RegExp("^http(s|)://.*instagram.com.*/.*$");
      let type = checkString(this.input);
      if (!insUrlPattern.test(this.input)) {
        //点击解析下载按钮
        handleClick("action_ins_detect_boinsom", {
          site: "other",
          noislink: this.input,
          from: "video",
          type: type,
        });
        this.httpError2 = true;
        this.isHttpLoading = false;
        return;
      }
      //点击解析下载按钮
      handleClick("action_ins_detect_boinsom", {
        site: "other",
        from: "video",
        type: type,
      });
      //开始解析  ins_start_resolve
      handleClick("ins_start_resolve", {
        islink: this.input,
        from: "video",
        type: type,
      });
      this.isHttpLoading = true;
      try {
        let result = this.uki(this.input);
        const response = await fetch(
          "https://savinginsta.com/api/downloader/analysis",
          {
            method: "POST",
            headers: { "Content-Type": "application/json" },
            body: JSON.stringify({
              path: result,
            }),
          }
        );
        let encryptedResponse = await response.text();
        let parse = JSON.parse(encryptedResponse);
        if (parse.code != 200) {
          // 解析失败  ins_resolve_fail
          handleClick("ins_resolve_fail", {
            reason: "Failed to fetch",
            islink: this.input,
            from: "video",
            type: type,
          });
          this.httpError1 = true;
          this.isHttpLoading = false;
          return;
        } else {
          //解析成功  ins_resolve_success
          handleClick("ins_resolve_success", {
            type: type,
            from: "video",
          });
          let decryptedResponse = await this.eki(parse.data); // 使用你的解密函数
          this.successList = JSON.parse(decryptedResponse);
          this.success = true;
          this.isHttpLoading = false;
        }
      } catch (error) {
        // 解析失败  ins_resolve_fail
        handleClick("ins_resolve_fail", {
          reason: "Failed to fetch",
          islink: this.input,
          from: "video",
          type: type,
        });
        console.error(error);
        this.httpError1 = true;
        this.isHttpLoading = false;
      }
    },

    uki(input) {
      let CIPHER_ALGORITHM = "DES-CBC";
      let IV_SIZE = 8;
       
      
  try {
        const complexKey = [
          process.env.part1,
          process.env.part2,
          process.env.part3,
          process.env.part4,
          process.env.part5,
          process.env.part6,
          process.env.part7,
          process.env.part8,
        ].join("");
        const keyBytes = CryptoJS.enc.Utf8.parse(complexKey);
        const inputBytes = CryptoJS.enc.Utf8.parse(input);
        const ivBytes = CryptoJS.lib.WordArray.random(IV_SIZE);
        const encrypted = CryptoJS.DES.encrypt(inputBytes, keyBytes, {
          iv: ivBytes,
          mode: CryptoJS.mode.CBC,
          padding: CryptoJS.pad.Pkcs7,
        });
        const ciphertext = ivBytes.concat(encrypted.ciphertext);
        return ciphertext.toString();
      } catch (error) {
        console.error(error);
        return null;
      }
    },
    eki(cipherText) {
      let CIPHER_ALGORITHM = "DES-CBC";
      let IV_SIZE = 8;
       
      const complexKey = [
          process.env.part1,
          process.env.part2,
          process.env.part3,
          process.env.part4,
          process.env.part5,
          process.env.part6,
          process.env.part7,
          process.env.part8,
        ].join("");
      try {
        let keyBytes = CryptoJS.enc.Utf8.parse(
          complexKey.padEnd(CIPHER_ALGORITHM === "DES-CBC" ? 8 : 16)
        );
        let ivBytes = { iv: CryptoJS.enc.Hex.parse(process.env.DES_IV) }; // 如果使用CBC模式，需要一个初始化向量iv，这里是空向量
        let decrypted = CryptoJS.DES.decrypt(
          { ciphertext: CryptoJS.enc.Hex.parse(cipherText) },
          keyBytes,
          ivBytes
        );
        return decrypted.toString(CryptoJS.enc.Utf8);
      } catch (e) {
        console.error(e);
        return null;
      }
    },
    sendDownload(event) {
      if (event.keyCode === 13 && !this.isHttpLoading) {
        this.downloadHandel();
        event.preventDefault();
        return false;
      }
    },
    changeTab(k) {
      this.current = k;
    },
    handleInput(e) {
      this.debouncedDownInput(e);
    },
    debounce(fn, delay) {
      let timer;
      return function () {
        let context = this;
        let args = arguments;
        clearTimeout(timer);
        timer = setTimeout(() => {
          fn.apply(context, args);
        }, delay);
      };
    },

    downInput(e) {
      let type = checkString(e.target.value);
      // 粘贴链接到输入框 action_ins_paste
      handleClick("action_ins_paste", {
        islink: e.target.value,
        from: "photo",
        type: type,
      });
    },
    handleClickPasted() {
      if (!navigator.clipboard) {
        console.log("Clipboard API not available");
        return;
      }
      navigator.clipboard
        .readText()
        .then((text) => {
          this.input = text;
          let type = checkString(text);
          // 粘贴链接到输入框 action_ins_paste
          handleClick("action_ins_paste", {
            islink: text,
            from: "photo",
            type: type,
          });
        })
        .catch((err) => {
          console.error("Failed to read clipboard contents: ", err);
        });
    },
    showLanguageHandel() {
      this.$refs.languageRef.close();
    },
    refresh() {
      this.success = false;
      this.input = "";
      this.successList = [];
    },
    goToTop(site) {
      //切换页面
      handleClick("action_page_switch", {
        site: site,
        from: top,
      });
    },
    goToTools(site) {
      //切换页面
      handleClick("action_page_switch", {
        site: site,
        from: tools,
      });
    },
  },
};
</script>
<style lang="scss" scoped>
@import "@/static/style/index.css";
.loading {
  .loading-dots {
    position: relative;
    z-index: 999;
    margin-top: 70px;
  }

  .dot {
    background-color: #ffffff;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin: 0 10px;
    animation: loading-animation 1.5s infinite;
  }

  .dot:nth-child(2) {
    animation-delay: 0.5s;
  }

  .dot:nth-child(3) {
    animation-delay: 0.8s;
  }
  .dot:nth-child(4) {
    animation-delay: 1s;
  }
}
@keyframes loading-animation {
  0%,
  50%,
  80%,
  100% {
    transform: scale(1);
  }
  40% {
    transform: scale(1.5);
  }
}
@media (max-width: 768px) {
  .loading {
    .loading-dots {
      margin-top: 26px !important;
    }
    .dot {
      width: 8px !important;
      height: 8px !important;
    }
  }
}
</style>
